/**
* @Description: WoShop商城
* @Author: 梧桐
* @Copyright: 武汉一一零七科技有限公司©版权所有
* @Link: www.wo-shop.net
* @Contact: QQ:2487937004
*/
<template>
	<view class="index_class">
		<view class="cont-order">
			<!-- <div class="tip flex" v-if="cartsureInfo.assem_zt.is_show == 1">
        <i class="iconfont">&#xe603;</i>
        <span>开团24小时内拼团成功，商家发货；若人数不足，系统自动退款关单；</span>
      </div> -->
	  
		<view class="goods_type" v-if="is_mail && check">
			<view class="goods_type_title" @click="goodsTypeMethod(1)">
				<view :class="goods_type == 1 ?'goods_type_name active' : 'goods_type_name'">普通快递</view>
				<view class="goods_type_active" v-if="goods_type == 1"></view>
			</view>
			<view class="goods_type_title"  @click="goodsTypeMethod(2)">
				<view :class="goods_type == 2 ?'goods_type_name active' : 'goods_type_name'">门店配送</view>
				<view class="goods_type_active" v-if="goods_type == 2"></view>
			</view>
		</view>
		
		<view class="phone" @click="getnav('/pagesB/my/address?isconfirm=true')" v-if="goods_type==1">
			<i class="iconfont icon_e712"></i>
			<view class="tap_address" v-if="address">
				<view class="flex-align">
					{{address.contacts}}
					<text class="u-m-l-10">{{address.phone}}</text>
				</view>
				<text>{{address.province}}{{address.city}}{{address.area}} {{address.address}}</text>
			</view>
			<view class="tap_address" v-else>{{$t('添加收货地址')}}</view>
			<i class="iconfont icon_e60c phone-iconfont"></i>
			<image class="p_bottom" src="/static/images/img/address_img.png" />
		</view>
		
		
		<view class="per-lists"  v-if="goods_type==2">
			<!-- @click="getnav('/pagesB/my/ModifynickName')" -->
			<view class="items">
				<i class="iconfont icon_e655"></i>
				<view style="width:90%">
					<input type="text" v-model="username" :placeholder="$t('请输入用户名')" />
				</view>
			</view>
			<view class="items">
				<i class="iconfont icon_e682"></i>
				<view style="width:90%">
					<input type="text" v-model="phone" :placeholder="$t('请输入手机号')" />
				</view>
			</view>
		</view>
			
			
			
			<view v-for="(goodtime,keys) in goodinfo" :key="keys">
				<view class="fresh_list">
					<view class="fresh-name">
						<i class="iconfont">&#xe735;</i>
						{{goodtime.goodres[0].shop_name}}
					</view>
					
					
					<view class="order_list" @click="coupon(3,goodtime.shop_store)" v-if="goods_type == 2">
						<view class="juan">
							<text class="order_list_left_title">{{$t('查看自提点')}}({{goodtime.shop_store.length}})</text>
						</view>
						<i class="iconfont icon_e60c order_color"></i>
					</view>
					
					
					<view v-for="(time,index) in goodtime.goodres" :key="index">
						<image class="fresh_img" :src="time.thumb_url" />
						<view class="fresh_banner">
							<!-- <view class="fresh_tip">好多绿蔬菜</view> -->
							<view class="fresh_text">{{time.goods_name}}</view>
							<text class="attr_color">{{time.goods_attr_str}}</text>
							<view class="address">
								<view v-if="cartsureInfo.ac_type != 2" class="pirve">
									{{$t('¥')}}{{time.shop_price}}
									<text>/{{$t('件')}}</text>
								</view>
								<view v-if="cartsureInfo.ac_type == 2" class="pirve">
									{{$t('积分')}}{{time.shop_price['integral']}}{{$t('个')}}+{{$t('¥')}}{{time.shop_price['price']}}
									<text>/{{$t('件')}}</text>
								</view>


							</view>
							<view class="shop">{{$t('购买数量')}}:{{time.goods_num}}</view>
						</view>
					</view>
				</view>

				<view class="adds_list">
					<!-- <view @click="coupon(1,goodtime)">
						<text>{{$t('优惠券')}}</text>
						<view>
							¥ {{goodtime.youhui_price}} <span></span>
							<i class="iconfont icon_e60c"></i>
						</view>
					</view> -->
					<view>
						<text>{{$t('总计')}}</text>
						<view>
							¥ {{goodtime.yuanjia_price}}
							<i class="iconfont icon_e60c" style="color:transparent!important"></i>
						</view>
					</view>
					<!-- <view>
						<text>{{$t('会员折后')}}</text>
						<view>
							¥ {{goodtime.xiaoji_price}}
							<i class="iconfont icon_e60c" style="color:transparent!important"></i>
						</view>
					</view> -->
					
					<view @click="coupon(2,goodtime)">
						<text>{{$t('运费')}}</text>
						<view>
							¥ {{goodtime.freight}} {{goodtime.freight ==0 ? $t('包邮'): ''}}
							<i class="iconfont icon_e60c"></i>
						</view>
					</view>
					
					<view>
						<text style="color:tomato;">会员全场享7折返利</text>
					</view>
				</view>
			</view>
			<u-popup ref="popupCopun" mode="bottom" border-radius="12">
				<view class="popup-coupon" v-if="pop == 1">
					<view class="popup-title">{{$t('优惠券')}}</view>
					<view class="coupon-list">
						<view class="cuxiao">
							<text class="title">{{$t('优惠券')}}</text>
							<view class="content">
								<!-- <view style="font-size:22upx">safgasfsd</view> -->
								<view style="color:#999;font-size:22upx">
									{{infoCoupon.coupon_str? infoCoupon.coupon_str:$t('暂无优惠信息')}}
								</view>
							</view>
							<i class="iconfont"></i>
						</view>
						<view class="cuxiao" v-if="infoCoupon.cxhuodong?infoCoupon.cxhuodong.length>0:0">
							<text class="title">{{$t('促销')}}</text>
							<view class="content">
								<view style="color:#999;font-size:22upx;margin-bottom:20upx;"
									v-for="(cou,index9) in infoCoupon.cxhuodong" :key="index9">{{cou}}</view>
							</view>
							<i class="iconfont"></i>
						</view>
					</view>

					<view class="popup-com">
						<button @click="hidePopup">{{$t('完成')}}</button>
					</view>
				</view>

				<view class="popup-coupon" v-if="pop == 2">
					<view class="popup-title">{{$t('配送方式')}}</view>
					<view class="coupon-list">
						<view class="cuxiao">
							<text class="title"> {{$t('配送')}}</text>
							<view class="content">
								<!-- <view style="font-size:22upx">safgasfsd</view> -->
								<view style="color:#999;font-size:22upx">{{infoCoupon.freight_str}}</view>
							</view>
							<i class="iconfont"></i>
						</view>
					</view>

					<view class="popup-com">
						<button @click="hidePopup">{{$t('完成')}}</button>
					</view>
				</view>
				
				
				<view class="popup-coupon" v-show="pop==3">
					<view class="popup-title">{{$t('店铺自提点')}}</view>
					<view class="coupon-list">
						<view class="guarantee" v-for="(shopStore,index) in infoCoupon" :key="index">
							<image />
							<view class="guar-cont">
								<view>{{shopStore.province}}{{shopStore.city}}{{shopStore.area}}</view>
								<view style="color:#999;margin-top:10rpx;">{{shopStore.address_detail}}</view>
							</view>
						</view>
					</view>
				
					<view class="popup-com">
						<button @click="hidePopup">{{$t('确定')}}</button>
					</view>
				</view>
				
			</u-popup>
			<view class="amountFooter">
				<p v-if="cartsureInfo.ac_type != 2" class="left">
					<text>{{$t('￥')}}</text>
					<text class="price">{{cartsureInfo.zsprice}}</text>
				</p>
				<p v-if="cartsureInfo.ac_type == 2" class="left">
					<text>{{$t('积分')}}</text>
					<text class="price">{{cartsureInfo.integral}}</text>
					<text>{{$t('个')}}+{{$t('￥')}}</text>
					<text class="price">{{cartsureInfo.zsprice}}</text>
				</p>
				<u-button hair-line ripple :custom-style="customStyle" style="width:240upx" shape="circle"
					@click="submitOrder">{{$t('提交订单')}}</u-button>

			</view>
		</view>

		<pay-pop  ref="payPop" :callbackUrl="'/pagesC/order/allOrder?index=6'" :isLinkTo="true"
			:totalPrice="Number(cartsureInfo.zsprice).toFixed(2)"  :integral="cartsureInfo.integral">
			<div class="pay-btn" @click="$u.throttle(crosspay,1500)">{{$t('确认支付')}}</div>
		</pay-pop>
		<u-toast ref="uToast" />

	</view>
</template>

<script>
	let cart_idresList = ""; // 购物车商品id
	let paydataYue = ""; // 提交商品订单
	let orderInfoData = {};
	import payPop from "@/pagesC/components/payPop";

	export default {
		data() {
			return {
				infoCoupon: {},
				cartsureInfo: {},
				address: "", // 收货地址
				goodinfo: {},
				pop: 1,
				valShow: false,
				valueStatus: 0, // 更新页面状态 防止页面卡死
				params: null,
				wechatMiniProgram: 0,
				h5: 0,
				totalPrice: "0.00",
				customStyle: {
					'backgroundImage': 'linear-gradient(to right, #ffa468, #fa3f3f)',
					'color': '#fff',
					'margin': '0',
					'fontSize': '24upx'
				},
				
				goods_type:0,
				is_mail:0,//是否是邮寄商品
				check:0,//门店配送商品
				username:'',
				phone:'',
			};
		},
		components: {
			payPop
		},
		onShow() {
			paydataYue = "";
			if (this.$store.state.confirmAddress) {
				this.address = this.$store.state.confirmAddress;
			}
			console.log(cart_idresList);
			if (cart_idresList.type == 1) {
				// 商品详情立即购买
				this.getpursure(cart_idresList);
			} else if (cart_idresList.type == 2) {
				// 购物车购买
				this.getcartsure(cart_idresList);
			}
		},
		onLoad(opiton) {
			//#ifdef MP-WEIXIN
			this.wechatMiniProgram = 1;
			//#endif
			//#ifdef H5
			this.h5 = 1;
			//#endif
			this.params = opiton;
			
			if(opiton.goods_type){
				this.goods_type = opiton.goods_type;
			}
			
			// console.log(this.params)
			if (opiton.type == 1) {
				// 商品详情立即购买
				this.getpursure(opiton);
			} else if (opiton.type == 2) {
				// 购物车购买
				this.getcartsure(opiton);
			}
			cart_idresList = opiton;


			uni.setNavigationBarTitle({
				title: this.$t('立即结算')
			});

		},
		watch: {
			valShow() {
				/**
				 * 更新页面状态 防止页面卡死
				 */
				this.statusMath(this);
			}
		},
		onBackPress() {
			//
			if (this.valShow) {
				this.getnav("/pagesC/order/allOrder?backindex=2");
				return true;
			}
		},
		methods: {
			goodsTypeMethod(goods_type){
				this.goods_type = goods_type;
				this.getpursure(this.params);
			},
			
			coupon(type, data) {
				if (type == 1) {
					// 优惠
					if (Number(data.youhui_price) <= 0) {}
				} else if (type == 2) {
					// 运费
					if (Number(data.freight) <= 0) {}
				}

				this.pop = type;
				this.infoCoupon = data || {};
				this.$refs.popupCopun.open();
				// console.log(infoCoupon);
			},
			/**
			 *  // 购物车购买
			 */
			getcartsure(data) {
				this.$http.getcartsure({
					cart_idres: data.cart_idres,
					goods_type:this.goods_type,
					address_id:this.address.id,
				}).then(res => {
					if (res.status == 200) {
						this.cartsureInfo = res.data;
						this.address = res.data.address;
						this.goodinfo = res.data.goodinfo;
					}
				});
			},
			/**
			 * // 商品详情立即购买
			 */
			getpursure(data) {
				this.$http.getpursure({
						pur_id: data.pur_id,
						pin_number: data.pin_number,
						fangshi: data.fangshi,
						type:this.goods_type,
						address_id:this.address.id,
					})
					.then(res => {
						if (res.status == 200) {
							this.cartsureInfo = res.data || '';
							this.address = res.data.address || '';
							this.goodinfo = res.data.goodinfo || '';
							this.is_mail = res.data.is_mail || 0;
							this.check = res.data.check || 0;
							if(this.goods_type == 0){
								this.goods_type = res.data.is_mail == 1 ? 1 : res.data.check == 1 ? 2 : 1;
							}
						}
					});
			},
			/**
			 * 获取支付订单数据
			 *
			 */
			orderInfo(typeIndex) {
				let dataType = {
					dz_id: this.address.id,
					zf_type: typeIndex,
					goods_type:this.goods_type,
					username:this.username,
					phone:this.phone
				};
				return new Promise(reslove => {
					if (cart_idresList.type == 2) {

						// 购物车创建订单
						dataType.cart_idres = cart_idresList.cart_idres;
						this.$http.getaddorderPay(dataType).then(res => {
							if (res.status == 200) {
								reslove(res);
								this.$refs.payPop.payModel = true; // 弹出
							} else {
								this.$toast(this.$t(res.mess));
							}
						});
					} else if (cart_idresList.type == 1) {
						// 立即购买创建订单
						dataType.pur_id = cart_idresList.pur_id;
						this.$http.getpuraddorderPay({
								...dataType,
								fangshi: this.params.fangshi,
								pin_number: this.params.pin_number,
							})
							.then(res => {
								if (res.status == 200) {
									reslove(res);
									this.$refs.payPop.payModel = true; // 弹出
								} else {
									this.$toast(res.mess);
								}
							});
					}
				});
			},
			// 生成拉起支付的密钥
			payFall(paydata, zf_type) {
				let data = {
					order_number: paydata.data.order_number,
					zf_type: zf_type,
					wechat_miniprogram: this.wechatMiniProgram,
					h5: this.h5
				}
				if (this.wechatMiniProgram === 1) {
					data.xcx_openid = uni.getStorageSync('xcxOpenid')
				}
				return new Promise(resolve => {
					this.$http.getzhifu(data)
						.then(res2 => {
							if (res2.status == 200) {
								resolve(res2);
							}
						}).catch((e) => {
							console.log(3)
						});
				});
			},
			async submitOrder() {
				if(this.goods_type == 1){
					if (this.address == "") {
						return this.$toast(this.$t('请先添加收货地址'));
					}
				}else if(this.goods_type == 2){
					if(this.username == "" || this.phone == ""){
						return this.$toast(this.$t('请填写联系人和电话'));
					}
				}else{
					return this.$toast(this.$t('提货方式错误'));
				}
				orderInfoData = await this.orderInfo();
			},

			async crosspay() {
				let ref = this.$refs.payPop
				
				if(this.cartsureInfo.ac_type == 2 && this.cartsureInfo.integral > 0  && parseFloat(this.cartsureInfo.zsprice) == 0){
					ref.payType = 4
				}

				if (ref.payType == 5) { // 银行卡支付
					ref.orderNumber = orderInfoData.data.order_number
					ref.bankModel = true
					return
				} else if (ref.payType == 3 || ref.payType == 4) { // 余额支付、积分积分
					ref.orderNumber = orderInfoData.data.order_number
					ref.hasPayPwd()
				} else { // 支付宝、微信支付
					const temp = await this.payFall(orderInfoData, ref.payType);
					ref.payinfos = await temp.data.infos
					ref.crosspay()
				}


				this.$hideLoading()
			},

			hidePopup() {
				this.$refs.popupCopun.close(); // 关闭
			}

		}
	};
</script>

<style lang="scss" scoped>
	@import '~uview-ui/index.scss';

	.fresh-name {
		display: flex;
		align-items: center;
	}
	.goods_type{
		flex-direction: row;
		justify-content: center;
		display: flex;
		.goods_type_title{
			width: 50%;
			font-size:30upx;
			height:85upx;
			line-height:80upx;
			text-align: center;
			flex-direction: row;
			justify-content: center;
			flex-wrap: wrap;
			display:flex;
			.goods_type_name{
				width:100%;
			}
			.active{
				color:#e7512b;
			}
			.goods_type_active{
				height:5upx;
				background-color: #e7512b;
				width:100upx;
			}
		}
	}
	.order_list {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 0;
	
		.juan {
			display: flex;
			text {
				font-size: 28rpx;
				color: #303133;
				&:nth-child(1) {
					font-weight: 500;
				}
				;
				&:nth-child(2),
				&:nth-child(3) {
					color: #606266;
				}
			}
			.color {
				color: #f44336;
			}
		}
	
		.order_color {
			font-size: 26rpx;
			color: #333;
		}
	}

	.money {
		padding-left: 20upx;
		font-size: 24upx;
		color: #999;
	}

	.icon_e712 {
		text-align: center;
		font-size: 45upx;
	}

	.cuxiao {
		margin-bottom: 40upx;
	}

	.tip {
		align-items: center;
		height: 98upx;
		padding: 0 30upx;
		color: #ed6a0c;
		background: #fffbe8;
		font-size: 26upx;

		i {
			padding-right: 10upx;
		}
	}

	.adds_list view {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.phone {
		display: flex;
		align-items: center;
		padding: 0 30upx;

		.tap_address {
			flex: 1;
			padding: 0 10upx;
		}

		.phone-iconfont {
			position: static !important;
			padding-right: 0;
			width: auto !important;
			margin: 0;
			padding: 0 !important;
		}
	}

	.amountFooter {
		display: flex;
		position: fixed;
		bottom: 0;
		width: 100%;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		padding: 12upx 30upx;

		.left {
			color: tomato;

			.price {
				font-size: 48upx;
				font-weight: bold;
			}
		}
	}

	.u-p-30 {
		padding: 30upx
	}

	.payWrap {
		.title {
			text-align: center;
		}

		.money {
			font-weight: bold;
			font-size: 52upx;
			color: red;
			text-align: center;
			margin: 40upx 0;
		}

		.item {
			padding: 20upx 0;

		}
	}
</style>
